import React, { Component } from 'react';
import {Text, View, Image, TextInput, TouchableOpacity} from 'react-native';
import { base } from "../../../assets/style";
import LinearGradient from "react-native-linear-gradient";
import Toast from 'react-native-easy-toast'
import Loading from '../../../components/loading/index'
import { API } from "../../../api";
import { login } from "../../../utils/login";
import {i18n} from "../../../utils/locales/i18n";

const md5 = require('md5')

type Props = {};
export default class GoogleVerify extends Component<Props> {
    static navigationOptions = ({navigation}) => {
        return {
            title: i18n.t('i203'),
            headerStyle: {
            },
            headerTintColor: '#0f0f0f',
            headerBackTitle: null
        }
    };
    constructor() {
        super()
        this.state = {
            googleCode: '',
            modalVisible: false,
            currentToastInfo: ''
        }
    }
    sendGoogleVerify = async () => {
        if (!this.state.googleCode) {
            this.refs.toast.show(i18n.t('i204'))
            return
        }
        if (!this.props.navigation.getParam('uuid')) {
            this.refs.toast.show('Error: can not get uuid')
            return
        }
        this.setState({modalVisible: true})
        const sendData = {}
        sendData.uuid = this.props.navigation.getParam('uuid')
        sendData.code = this.state.googleCode
        const res = await API.validateGoogle(sendData)
        // 验证失败
        // code: 10014
        // dev_info: "谷歌两步验证失败"
        // msg: "验证失败"
        // status: 200

        // 验证成功
        // code: 10000
        // data:
        //     IsOpenGoogle: 0
        //     Uuid: "97eeb542-8529-4a80-e027-cdc3018a86ea"
        // msg: "登录成功"
        // status: 200

        if (res.code === 10000) {
            await login(res.data.Uuid)
            this.setState({currentToastInfo: res.msg})
            this.setState({modalVisible: false, currentToastInfo: ''})
            this.props.navigation.navigate('AppScreen')
        } else {
            this.setState({modalVisible: false, currentToastInfo: ''})
            this.refs.toast.show(res.msg || i18n.t('o_defeat'))
        }

    }
    render() {
        return (
            <View style={[base.bg_white, base.flex_1]}>
                {/*toast*/}
                <Toast ref="toast" position='center'/>
                { this.state.modalVisible ? (
                    <Loading
                        info={this.state.currentToastInfo}
                    />) : null }
                <View style={[{ paddingTop: 50, paddingHorizontal: 25 }]}>
                    <View style={[base.flex_row_center, { height: 45, width: '100%', borderColor: '#ffba82', borderWidth: 0.8, borderRadius: 5 }]}>
                        <TextInput
                            style={[base.color_orange]}
                            value={this.state.googleCode}
                            onChangeText={(text) => this.setState({googleCode: text})}
                            placeholder={i18n.t('i205')}
                            placeholderTextColor={'#ffba82'}
                        />
                    </View>

                    <TouchableOpacity
                        style={{width: '100%', paddingTop: 100}}
                        onPress={this.sendGoogleVerify}
                    >
                        <LinearGradient
                            start={{x: 0, y: 0}}
                            end={{x: 1, y: 1}}
                            colors={['#feac1c', '#ff7506']}
                            style={{ width: '100%', height: 46, borderRadius: 23, justifyContent: 'center', alignItems: 'center' }}
                        >
                            <Text style={{color: '#fff', fontSize: 16}}>{i18n.t('submit')}</Text>
                        </LinearGradient>
                    </TouchableOpacity>
                </View>
            </View>
        );
    }
}
